//@ts-ignore
import { GetterTree, MutationTree, ActionTree } from "vuex";
import Cesium from "../plugins/cesium";
import Vue from "vue";

let csViewer = null;

class State {
  cesiumSettings = {
    fpsTarget: 120,
  };
}

const actions = <ActionTree<State, any>>{
  //@ts-ignore
  aCsInit({ commit }) {
    return new Promise<void>((resolve, reject) => {
      setTimeout(() => {
        console.log("aCsInit");
        commit("mCsInit");
        resolve();
      }, 10);
    });
  },
};

const mutations = <MutationTree<State>>{
  mCsInit(state: any) {
    const imageryViewModels: any = [];
    imageryViewModels.push(
      new Cesium.ProviderViewModel({
        name: "Natural Earth\u00a0II",
        iconUrl: Cesium.buildModuleUrl(
          "Widgets/Images/ImageryProviders/naturalEarthII.png"
        ),
        tooltip:
          "Natural Earth II, darkened for contrast.\nhttp://www.naturalearthdata.com/",
        creationFunction: function() {
          return new Cesium.TileMapServiceImageryProvider({
            url: Cesium.buildModuleUrl("Assets/Textures/NaturalEarthII"),
          });
        },
      })
    );

    const viewerData = {
      targetFrameRate: state.cesiumSettings.fpsTarget,
      fullscreenButton: false,
    //  fullscreenButton: false,
    animation: false,
                geocoder: false,
                timeline: false,
                shouldAnimate: false,
                sceneModePicker: false,
                navigationHelpButton: false,
                infoBox: false,
                selectionIndicator: false,
                homeButton: false,
      
      imageryProviderViewModels: imageryViewModels, // added your Cesium Ion Token (main.ts) and remove this to get access to all layers
    };
    let  csViewer = new Cesium.Viewer("cesiumContainer", viewerData);


    Vue.prototype.$csViewer = csViewer;

    csViewer.cesiumWidget.creditContainer.style.display = "none";
    csViewer.scene.debugShowFramesPerSecond = true;

    csViewer.scene.fxaa = true;
    csViewer.scene.postProcessStages.fxaa.enabled = true;

    csViewer.scene.postProcessStages.fxaa.enabled = false;
    csViewer.resulotionScale = 2.0;

    if (Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
      csViewer.resolutionScale = window.devicePixelRatio;
  }


           var layers = csViewer.imageryLayers;

           


           var imageProvider = new Cesium.UrlTemplateImageryProvider({
                //url: "/mydata1" + "/hunhe" + "/{z}/{x}/{y}" + ".jpg",
                url: Vue.prototype.$serverip + "/hunhemap" + "/{z}/{x}/{y}" + ".png",
                 // url: "http://192.168.20.246:8082" + "/hunhe"+  "/{z}/{x}/{y}" + ".jpg",

                maximumLevel: 18,
            });

            layers.addImageryProvider(imageProvider);


   // console.log("mCsInit",csViewer.scene.canvas);
  },
};

const getters = <GetterTree<State, any>>{};

const cesiumStore = {
  namespaced: false,
  modules: {},
  state: new State(),
  actions: actions,
  mutations: mutations,
  getters: getters,
};

export default cesiumStore;
